<template>
    <div class="content">
        <button class="btn" @click="toPath('/underline')">下划线过渡</button>
        <button class="btn" @click="toPath('/radar')">雷达效果</button>
        <button class="btn" @click="toPath('/flowbtn')">流光边框</button>
        <button class="btn" @click="toPath('/filter')">滤镜基础</button>
        <button class="btn" @click="toPath('/transition')">过渡效果基础</button>
        <button class="btn" @click="toPath('/shadow')">阴影</button>
    </div>
</template>
<script setup>
import { useRouter } from 'vue-router'

const router = useRouter()

const toPath = (path) => {
  router.push(path)
}
</script>
<style scoped>
.content {
  width: 100%;
  padding: 10px;
}
.btn {
  margin: 3px;
}
</style>